<template>
  <NvSpin :loading="props.loading">
    <NRadioGroup v-bind="attrs">
      <template v-if="attrs?.button">
        <NRadioButton v-for="item in props.dictData" :key="item.value" v-bind="item" />
      </template>
      <template v-else>
        <NFlex>
          <NRadio v-for="item in props.dictData" :key="item.value" v-bind="item" />
        </NFlex>
      </template>
    </NRadioGroup>
  </NvSpin>
</template>

<script lang="ts" setup>
import type { RadioGroupProps } from 'naive-ui'
import type { NvOption } from '@/types'
import { NFlex, NRadio, NRadioButton, NRadioGroup } from 'naive-ui'
import { useAttrs } from 'vue'
import { NvSpin } from '@/components'

defineOptions({
  inheritAttrs: false,
})

// fix: attrs 属性不能被侦听器使用，会导致监听整个对象
const props = defineProps<{ dictData?: NvOption[], loading?: boolean }>()
const attrs = useAttrs() as RadioGroupProps & { button?: boolean }
</script>
